<?php
$_product    = $this->getProduct();
$_attributes = Mage::helper('core')->decorateArray($this->getAllowAttributes());
?>
<?php if ($_product->isSaleable() && count($_attributes)):?>
    <dl>
    <?php foreach($_attributes as $_attribute): ?>
        <dt><label class="required"><em>*</em><?php echo $_attribute->getLabel() ?></label></dt>
        <dd<?php if ($_attribute->decoratedIsLast){?> class="last"<?php }?>>
            <div class="input-box">
                <select name="super_attribute[<?php echo $_attribute->getAttributeId() ?>]" id="attribute<?php echo $_attribute->getAttributeId() ?>" class="required-entry super-attribute-select">
                    <option><?php echo $this->__('Choose an Option...') ?></option>
                  </select>
              </div>
        </dd>
        <script type="text/javascript">
        var attribute<?php echo $_attribute->getAttributeId() ?> = 0;
            document.getElementById('attribute<?php echo $_attribute->getAttributeId() ?>').onchange=function(e){
                attribute<?php echo $_attribute->getAttributeId() ?>++;
                if(attribute<?php echo $_attribute->getAttributeId() ?> == 1){
                    triggerEvent(this,'change');
                    attribute<?php echo $_attribute->getAttributeId() ?>=0;
                }
            };
        </script>
    <?php endforeach; ?>
    </dl>
    <script type="text/javascript">
        var spConfig = new Product.Config(<?php echo $this->getJsonConfig() ?>);
        function triggerEvent(element, eventName) {
            // safari, webkit, gecko
            if (document.createEvent)
            {
                var evt = document.createEvent('HTMLEvents');
                evt.initEvent(eventName, true, true);
                
                return element.dispatchEvent(evt);
            }
         
            // Internet Explorer
            if (element.fireEvent) {
                return element.fireEvent('on' + eventName);
            }
        }
    </script>
<?php endif;?>
